<template>
  <basic-container>
    <dispenser-list
      ref="fillingMachineListRef"
      v-show="showType === 'list'"
      @add="handleAdd"
      @detail="handleDetail"
    />
    <dispenser-detail
      :info="currentInfo"
      v-if="showType === 'detail'"
      @back="handleBack"
    />
    <dispenser-add-content v-if="showType === 'add'" @back="handleBack" />
  </basic-container>
</template>

<script>
import dispenserList from "@/views/stake/dispenser-list.vue";
import dispenserDetail from "@/views/stake/dispenser-detail.vue";
import dispenserAddContent from "@/views/stake/dispenser-add-content.vue";
import { mapGetters } from "vuex";

export default {
  data() {
    return {
      showType: "list",
      currentInfo: null,
    };
  },
  computed: {
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.notice_add, false),
        viewBtn: this.vaildData(this.permission.notice_view, false),
        delBtn: this.vaildData(this.permission.notice_delete, false),
        editBtn: this.vaildData(this.permission.notice_edit, false),
      };
    },
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
  },
  components: {
    dispenserList,
    dispenserDetail,
    dispenserAddContent,
  },
  methods: {
    handleDetail(row) {
      this.currentInfo = row;
      this.showType = "detail";
    },
    handleAdd() {
      this.showType = "add";
    },
    handleBack(flag) {
      this.showType = "list";
      if (flag) this.$refs.fillingMachineListRef.refresh();
    },
  },
};
</script>

<style></style>
